<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<script SRC="node_modules/angular/angular.js"></script>
<script>
    var app=angular.module("myApp",[]);
    app.service("jsonpService",[function () {
        //把这个内部函数绑定到服务上
        this.getJsonp=function(url,params,func) {
            var strurl=url+"?";
            for(var key in params){
                strurl+=key+"="+params[key]+"&";
            }
            //为回调函数取一个随机数名字。
            var jsonpname="jsonp_"+Math.random().toString().substring(2);
            strurl+="callback="+jsonpname;
            var script=document.createElement("script");
            script.src=strurl;
            document.body.appendChild(script);
            window[jsonpname]=function (data) {
                func(data);
                document.body.removeChild(script);
            };




        }
    }]);
    app.controller("myCtrl",["$scope","jsonpService",function ($scope,jsonpService) {
        var url1='https://api.douban.com/v2/book/1220562';
        var params={
            'apikey':'00fa6c0654689a0202ef4412fd39ce06'
        };
        jsonpService.getJsonp(url1,params,function (data) {
            $scope.data=data;
            console.log(data);
            $scope.$apply();
        })
    }])


</script>
</body>
</html>
















<!--<!DOCTYPE html>-->
<!--<html lang="en">-->
    <!--<head>-->
    <!--<meta charset="UTF-8">-->
    <!--<title>Title</title>-->
    <!--</head>-->
    <!--<body ng-app="myApp" ng-controller="myCtrl">-->
    <!--<pre>-->
    <!--{{data|json}}-->
<!--</pre>-->
<!--</body>-->
<!--<script src="js/angular.js"></script>-->
    <!--<script>-->
<!--//封装jsonp服务-->
<!--var app=angular.module('myApp',[]);-->
<!--app.service('jsonpService',[function () {-->
    <!--this.getJSONP=function (url,params,func) {-->
        <!--//1 拼凑链接-->
        <!--// 1.1 生成一个随机的jsonp名字-->
        <!--//2 创建script标签将链接放入到src-->
        <!--//3 接收jsonp方法-->
        <!--//4 将创建好的script标签插入到页面上去-->
        <!--var strUrl=url+'?';-->
        <!--//遍历对象-->
        <!--for(var key in params){-->
            <!--strUrl+=key+'='+params[key]+'&'-->
        <!--}-->
        <!--//随机的jsonp名字-->
        <!--var jsonpname='jsonp_'+Math.random().toString().substring(2);-->
        <!--strUrl+='callback='+jsonpname;-->
        <!--//创建script标签-->
        <!--var script=document.createElement('script');-->
        <!--script.src=strUrl;-->
        <!--//jsonp方法-->
        <!--window[jsonpname]=function (data) {-->
            <!--//通过回调函数将参数传递出去-->
            <!--func(data);-->
            <!--//销毁script标签-->
            <!--document.body.removeChild(script);-->
        <!--};-->
        <!--//创建的script标签添加到body中-->
        <!--document.body.appendChild(script);-->
    <!--}-->
<!--}]);-->
<!--app.controller('myCtrl',['$scope','jsonpService',function ($scope,jsonpService) {-->
    <!--var url1='https://api.douban.com/v2/book/1220562';-->
    <!--var obj={-->
        <!--'apikey':'00fa6c0654689a0202ef4412fd39ce06'-->
    <!--};-->
    <!--jsonpService.getJSONP(url1,obj,function (data) {-->
        <!--$scope.data=data;-->
        <!--console.log(data);-->
        <!--$scope.$apply();-->
    <!--});-->
<!--}])-->
<!--</script>-->
<!--</html>-->